{include file='common/header'}


<div class="page-bar">
    <ul class="page-breadcrumb">
        <li>
            <i class="icon-home"></i>
            <a href="index.html">后台</a>
            <i class="fa fa-angle-right"></i>
        </li>
        <li>
            <span>管理面板</span>
            <i class="fa fa-angle-right"></i>
        </li>
        <li>
            <span>新增管理员</span>
        </li>
    </ul>
    <div class="page-toolbar">
        <div class="btn-group pull-right">
            <button type="button" class="btn btn-fit-height grey-salt dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-delay="1000" data-close-others="true"> 操作
                <i class="fa fa-angle-down"></i>
            </button>
            <ul class="dropdown-menu pull-right" role="menu">
                <li>
                    <a href="#" onclick="$('#btn_save1').click();">
                        <i class="icon-cloud-upload"></i> 提交保存</a>
                </li>
                <li>
                    <a href="#">
                        <i class="icon-refresh"></i> 重置表单</a>
                </li>
                <li>
                    <a href="javascript:void(0)" onclick="history.back();">
                        <i class="icon-action-undo"></i> 返回前一页</a>
                </li>
            </ul>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <!-- BEGIN PORTLET-->
        <div class="portlet light form-fit ">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-social-dribbble font-green"></i>
                    <span class="caption-subject font-green bold uppercase">Input Masks</span>
                </div>
                <div class="actions">
                    <a class="font-default fa-2x ks-scroll-down" href="javascript:;">
                        <i class="icon-arrow-down"></i>
                    </a>
                </div>
            </div>
            <div class="portlet-body form">
                <!-- BEGIN FORM-->
                <form class="form-horizontal form-bordered ks-form">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="control-label col-md-3">Date 1</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_date" type="text" />
                                <span class="help-block"> d/m/y </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3">Date 2</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_date1" type="text" />
                                <span class="help-block"> change the placeholder </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3">Date 3</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_date2" type="text" />
                                <span class="help-block"> multi-char placeholder </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3">Phone</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_phone" type="text" />
                                <span class="help-block"> (999) 999-9999 </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3">Tax ID</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_tin" type="text" />
                                <span class="help-block"> 99-9999999 </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3">Number</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_number" type="text" />
                                <span class="help-block"> mask "9" or mask "99" or ... mask "9999999999" </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3">Currency</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_currency" type="text" />
                                <span class="help-block"> 123456 => € ___.__1.234,56 </span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-3">Currency 2</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_currency2" type="text" />
                                <span class="help-block"> 123456 => € ___.__1.234,56(left aligned) </span>
                            </div>
                        </div>
                        <div class="form-group last">
                            <label class="control-label col-md-3">SSN</label>
                            <div class="col-md-4">
                                <input class="form-control" id="mask_ssn" type="text" />
                                <span class="help-block"> 999-99-9999. remove the empty mask on blur or when not empty removes the optional trailing part </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <button type="button" class="btn blue" id="btn_save1">
                                    <i class="fa fa-check"></i> Submit</button>
                                <button type="button" class="btn default">Cancel</button>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="portlet light form-fit ">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-settings font-dark"></i>
                    <span class="caption-subject font-dark sbold uppercase">IP Address Input</span>
                </div>
                <div class="actions">
                    <a class="font-default fa-2x ks-scroll-up" href="javascript:;">
                        <i class="icon-arrow-up"></i>
                    </a>
                    <a class="font-default fa-2x ks-scroll-down" href="javascript:;">
                        <i class="icon-arrow-down"></i>
                    </a>
                </div>
            </div>
            <div class="portlet-body form">
                <!-- BEGIN FORM-->
                <form class="form-horizontal form-row-seperated ks-form">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="control-label col-md-3">IPV4</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv4" type="text" />
                                <span class="help-block"> 192.168.120.150 </span>
                            </div>
                        </div>
                        <div class="form-group last">
                            <label class="control-label col-md-3">IPV6</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv6" type="text" />
                                <span class="help-block"> 3ffe:1900:4545:3:200:f8ff:fe21:67cf </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <a href="javascript:;" class="btn green" onclick="$(this).ajaxPost({confirm: 'Are you sure?', url: '#'})">
                                    <i class="fa fa-check"></i> Submit</a>
                                <a href="javascript:;" class="btn btn-outline grey-salsa">Cancel</a>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="portlet light form-fit ">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-settings font-dark"></i>
                    <span class="caption-subject font-dark sbold uppercase">IP Address Input</span>
                </div>
                <div class="actions">
                    <a class="font-default fa-2x ks-scroll-up" href="javascript:;">
                        <i class="icon-arrow-up"></i>
                    </a>
                    <a class="font-default fa-2x ks-scroll-down" href="javascript:;">
                        <i class="icon-arrow-down"></i>
                    </a>
                </div>
            </div>
            <div class="portlet-body form">
                <!-- BEGIN FORM-->
                <form action="#" class="form-horizontal form-row-seperated">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="control-label col-md-3">IPV4</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv4" type="text" />
                                <span class="help-block"> 192.168.120.150 </span>
                            </div>
                        </div>
                        <div class="form-group last">
                            <label class="control-label col-md-3">IPV6</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv6" type="text" />
                                <span class="help-block"> 3ffe:1900:4545:3:200:f8ff:fe21:67cf </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <a href="javascript:;" class="btn green">
                                    <i class="fa fa-check"></i> Submit</a>
                                <a href="javascript:;" class="btn btn-outline grey-salsa">Cancel</a>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="portlet light form-fit ">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-settings font-dark"></i>
                    <span class="caption-subject font-dark sbold uppercase">IP Address Input</span>
                </div>
                <div class="actions">
                    <a class="font-default fa-2x ks-scroll-up" href="javascript:;">
                        <i class="icon-arrow-up"></i>
                    </a>
                    <a class="font-default fa-2x ks-scroll-down" href="javascript:;">
                        <i class="icon-arrow-down"></i>
                    </a>
                </div>
            </div>
            <div class="portlet-body form">
                <!-- BEGIN FORM-->
                <form action="#" class="form-horizontal form-row-seperated">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="control-label col-md-3">IPV4</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv4" type="text" />
                                <span class="help-block"> 192.168.120.150 </span>
                            </div>
                        </div>
                        <div class="form-group last">
                            <label class="control-label col-md-3">IPV6</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv6" type="text" />
                                <span class="help-block"> 3ffe:1900:4545:3:200:f8ff:fe21:67cf </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <a href="javascript:;" class="btn green">
                                    <i class="fa fa-check"></i> Submit</a>
                                <a href="javascript:;" class="btn btn-outline grey-salsa">Cancel</a>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="portlet light form-fit ">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-settings font-dark"></i>
                    <span class="caption-subject font-dark sbold uppercase">IP Address Input</span>
                </div>
                <div class="actions">
                    <a class="font-default fa-2x ks-scroll-up" href="javascript:;">
                        <i class="icon-arrow-up"></i>
                    </a>
                    <a class="font-default fa-2x ks-scroll-down" href="javascript:;">
                        <i class="icon-arrow-down"></i>
                    </a>
                </div>
            </div>
            <div class="portlet-body form">
                <!-- BEGIN FORM-->
                <form action="#" class="form-horizontal form-row-seperated">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="control-label col-md-3">IPV4</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv4" type="text" />
                                <span class="help-block"> 192.168.120.150 </span>
                            </div>
                        </div>
                        <div class="form-group last">
                            <label class="control-label col-md-3">IPV6</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv6" type="text" />
                                <span class="help-block"> 3ffe:1900:4545:3:200:f8ff:fe21:67cf </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <a href="javascript:;" class="btn green">
                                    <i class="fa fa-check"></i> Submit</a>
                                <a href="javascript:;" class="btn btn-outline grey-salsa">Cancel</a>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="portlet light form-fit ">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-settings font-dark"></i>
                    <span class="caption-subject font-dark sbold uppercase">IP Address Input</span>
                </div>
                <div class="actions">
                    <a class="font-default fa-2x ks-scroll-up" href="javascript:;">
                        <i class="icon-arrow-up"></i>
                    </a>
                    <a class="font-default fa-2x ks-scroll-down" href="javascript:;">
                        <i class="icon-arrow-down"></i>
                    </a>
                </div>
            </div>
            <div class="portlet-body form">
                <!-- BEGIN FORM-->
                <form action="#" class="form-horizontal form-row-seperated">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="control-label col-md-3">IPV4</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv4" type="text" />
                                <span class="help-block"> 192.168.120.150 </span>
                            </div>
                        </div>
                        <div class="form-group last">
                            <label class="control-label col-md-3">IPV6</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv6" type="text" />
                                <span class="help-block"> 3ffe:1900:4545:3:200:f8ff:fe21:67cf </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <a href="javascript:;" class="btn green">
                                    <i class="fa fa-check"></i> Submit</a>
                                <a href="javascript:;" class="btn btn-outline grey-salsa">Cancel</a>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12">
        <div class="portlet light form-fit ">
            <div class="portlet-title">
                <div class="caption">
                    <i class="icon-settings font-dark"></i>
                    <span class="caption-subject font-dark sbold uppercase">IP Address Input</span>
                </div>
                <div class="actions">
                    <a class="font-default fa-2x ks-scroll-up" href="javascript:;">
                        <i class="icon-arrow-up"></i>
                    </a>
                    <a class="font-default fa-2x ks-scroll-down" href="javascript:;">
                        <i class="icon-arrow-down"></i>
                    </a>
                </div>
            </div>
            <div class="portlet-body form">
                <!-- BEGIN FORM-->
                <form action="#" class="form-horizontal form-row-seperated">
                    <div class="form-body">
                        <div class="form-group">
                            <label class="control-label col-md-3">IPV4</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv4" type="text" />
                                <span class="help-block"> 192.168.120.150 </span>
                            </div>
                        </div>
                        <div class="form-group last">
                            <label class="control-label col-md-3">IPV6</label>
                            <div class="col-md-4">
                                <input class="form-control" id="input_ipv6" type="text" />
                                <span class="help-block"> 3ffe:1900:4545:3:200:f8ff:fe21:67cf </span>
                            </div>
                        </div>
                    </div>
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-offset-3 col-md-9">
                                <a href="javascript:;" class="btn green">
                                    <i class="fa fa-check"></i> Submit</a>
                                <a href="javascript:;" class="btn btn-outline grey-salsa">Cancel</a>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- END FORM-->
            </div>
        </div>
    </div>
</div>



{include file='common/footer'}
<!--平滑滚动功能---------------------------------------------开始-->
<script>
    $(function () {
        $(".ks-scroll-up").each(function () {
            $(this).on('click', function () {
                $('html, body').animate({scrollTop: $('body').scrollTop() - $(this).parents('.row').prev().height()}, 500);
            })
        })
        $(".ks-scroll-down").each(function () {
            $(this).on('click', function () {
                $('html, body').animate({scrollTop: $('body').scrollTop() + $(this).parents('.row').height()}, 500);
            })
        })
    })
</script>
<!--平滑滚动功能---------------------------------------------结束-->

<script>
    $(function () {
        $("#btn_save1").on('click', function () {
            $(this).ajaxPost({
                confirm: '确认操作？',
                url: '#'
            })
        })
    })
</script>
